import useSetting from "@/hook/useSetting";
import { Layout } from "antd";
import { Footer } from "antd/es/layout/layout";
import { useState } from "react";

import CustHeader from "./header";
import Slider from "./slide";
import Main from "./main";
const CommonLayout: React.FC = () => {
  const [collapsed, setCollapsed] = useState(false);
  const changeSider = (isShow: boolean) => {
    setCollapsed(isShow);
  };

  const { footer } = useSetting();
  return (
    <Layout>
      <Slider collapsed={collapsed}></Slider>
      <Layout style={{ height: "100vh" }}>
        <CustHeader
          collapsed={collapsed}
          changeSider={changeSider}
        ></CustHeader>
        <Main></Main>
        <Footer style={{ textAlign: "center" }}>{footer} </Footer>
      </Layout>
    </Layout>
  );
};
export default CommonLayout;
